<form [formGroup]="form">
  <ix-fieldset class="title" [title]="'Allow Access' | translate">
    <div>
      <mat-checkbox
        formControlName="smb_access"
        color="primary"
        [ixTest]="['allow-access']"
      >
        <span class="access-checkbox">
          <ix-icon name="ix-smb-share"></ix-icon>
          {{ 'SMB Access' | translate }}
        </span>
      </mat-checkbox>
    </div>

    <div class="truenas-access-field">
      <mat-checkbox
        formControlName="truenas_access"
        color="primary"
        [ixTest]="['truenas-access']"
      >
        <span class="access-checkbox">
          <ix-icon name="ix-truenas-logo-mark"></ix-icon>
          {{ 'TrueNAS Access' | translate }}
        </span>
      </mat-checkbox>
      <div class="role-container">
        @if (form.value.truenas_access) {
          <ix-select
            class="role"
            formControlName="role"
            [options]="roles$"
            [required]="true"
          ></ix-select>

          <p class="role-hint">
            {{ 'Learn about' | translate }}
            <a href="https://www.truenas.com/docs/" ixTest="custom-roles-link">{{ 'custom roles.' | translate }}</a>
            <!-- TODO: Fix link on the href -->
          </p>
        }
      </div>
    </div>

    <div>
      <mat-checkbox
        formControlName="shell_access"
        color="primary"
        [ixTest]="['shell-access']"
      >
        <span class="access-checkbox">
          <ix-icon name="mdi-console-line"></ix-icon>
          {{ 'Shell Access' | translate }}
        </span>
      </mat-checkbox>
    </div>

    <div>
      <mat-checkbox
        formControlName="ssh_access"
        color="primary"
        [ixTest]="['ssh-access']"
      >
        <span class="access-checkbox">
          <ix-icon name="mdi-ssh"></ix-icon>
          {{ 'SSH Access' | translate }}
        </span>
      </mat-checkbox>
    </div>

    <p class="api-access-hint">{{ 'Access to API can be granted after user has been created.' | translate }}</p>
  </ix-fieldset>
</form>
